<template>
  <div>
    <el-progress :percentage="percentage" :format="formatFn" :show-text="true" style="display: inline-block; width: 80%;"></el-progress>
    <span>{{ formData[code] }}</span>
  </div>
</template>

<script>
export default {
  name: 'SftProgress',
  props: {
    componentDef: {
      type: Object,
      required: true
    },
    code: {
      type: String,
      required: true
    },
    formData: {
      type: Object,
      required: true
    }
  },

  data(){
    return {
    }
  },
  computed: {
      percentage() {
        let value = this.formData[this.code];
        let min = this.componentDef.min || 0;
        let max = this.componentDef.max || 100;

        if (min === max) {
          return value >= min ? 100 : 0; // 或根据需求返回 0/100
        }
        // 计算百分比 (0.0 ~ 1.0 范围)
        const percentage = (value - min) / (max - min);
        // 转换为 0~100 范围的百分比
        return Math.round(Math.max(0, Math.min(1, percentage)) * 100);
      },
  },
  methods: {
    formatFn(percentage) {
      return percentage + "%";
    }
  }
}


</script>